<div [ngStyle]="rightButton?.params?.backBoxCssStyle | styleFilter">
  <section id="{{achieveMentBoxId}}" class="achievement-box" [ngClass]="{
      'achievement-box': tagData.name==='appMyStatisticWorkTag'
      ,'achievement-box-new':tagData.name!=='appMyStatisticWorkTag'}"
    [ngStyle]="rightButton?.params?.outerBoxCssStyle | styleFilter">

    <ng-container *ngIf="tagData.name==='appMyStatisticWorkTag'&&achieveMentLeftList!==undefined">
      <div class="top-box">
        <div class="left-box">
          <span appDebounceClick (debounceClick)="getTodayData()" class="left-box-span"
            [ngClass]="{'check-tab': defaultTab,'uncheck-tab': !defaultTab}">{{achieveMentLeftLabel}}</span>
        </div>
        <div class="right-box">
          <span appDebounceClick (debounceClick)="getMonthData()" class="right-box-span"
            [ngClass]="{'uncheck-tab': defaultTab,'check-tab': !defaultTab}">{{achieveMentRightLabel}}</span>
        </div>
      </div>
      <div class="middle-box middle-box-padding">
        <div class="m-left-box">

          <span class="middle-span-left" [ngClass]="{'unSetBorder': achieveMentLeftList.cssType===1}"
            id="{{achieveMentMiddleLeftBoxSpanId}}" *ngIf="defaultTab===true">
            {{achieveMentLeftValue}}
            <span class="span-unit">{{unitLabel}}</span>
          </span>

          <span class="middle-span-left" [ngClass]="{'unSetBorder': achieveMentRightList.cssType===1}"
            id="{{achieveMentMiddleLeftBoxSpanId}}" *ngIf="defaultTab===false">
            {{achieveMentRightValue}}
            <span class="span-unit">{{unitLabel}}</span>
          </span>

        </div>
        <div class="m-right-box">
          <ng-container *ngIf="defaultTab">
            <ng-container *ngIf="achieveMentLeftList.cssType===0">
              <div class="m-div-left" *ngIf="achieveMentLeftList&&achieveMentLeftList[0].label">
                <div class="sub-span">
                  <span class="span-label">{{achieveMentLeftList[0].label}}</span>
                </div>
                <span class="inner-left-box">{{achieveMentLeftList[0].data}}</span>
              </div>
              <div class="m-div-right" *ngIf="achieveMentLeftList&&achieveMentLeftList[1].label">
                <div class="sub-span">
                  <span class="span-label">{{achieveMentLeftList[1].label}}</span>
                </div>
                <span class="inner-right-box">{{achieveMentLeftList[1].data}}</span>
              </div>
            </ng-container>
            <ng-container *ngIf="achieveMentLeftList&&achieveMentLeftList.cssType===1">
              <div>
                <span
                  class="listLabel">{{achieveMentLeftList[0].label}}</span><span>{{achieveMentLeftList[0].data}}</span>
              </div>
            </ng-container>
          </ng-container>
          <ng-container *ngIf="!defaultTab">
            <ng-container *ngIf="achieveMentLeftList&&achieveMentRightList.cssType===0">
              <div class="m-div-left" *ngIf="achieveMentLeftList&&achieveMentRightList[0].label">
                <div class="sub-span">
                  <span class="span-label">{{achieveMentRightList[0].label}}</span>
                </div>
                <span class="inner-left-box">{{achieveMentRightList[0].data}}</span>
              </div>
              <div class="m-div-right" *ngIf="achieveMentLeftList&&achieveMentRightList[1].label">
                <div class="sub-span">
                  <span class="span-label">{{achieveMentRightList[1].label}}</span>
                </div>
                <span class="inner-right-box">{{achieveMentRightList[1].data}}</span>
              </div>
            </ng-container>
            <ng-container *ngIf="achieveMentLeftList&&achieveMentRightList.cssType===1">
              <div>
                <span
                  class="listLabel">{{achieveMentRightList[0].label}}</span><span>{{achieveMentRightList[0].data}}</span>
              </div>
            </ng-container>
          </ng-container>
        </div>
      </div>
      <div class="bottom-box1" *ngIf="achieveMentLeftList.cssType===1"></div>
      <div class="bottom-box" *ngIf="achieveMentLeftList.cssType===0">
        <div class="bottom-inner-box" *ngIf="defaultTab">
          <ng-container *ngFor="let item of bottomLeftList;let i=index;">
            <div class="li-span li-first" *ngIf="i===0">
              <span class="bottom-label">{{item.label}}</span>
              <span class="bottom-data">{{item.data}}</span>
            </div>
            <div class="li-span" *ngIf="i!==0">
              <span class="bottom-label">{{item.label}}</span>
              <span class="bottom-data">{{item.data}}</span>
            </div>
            <div *ngIf="i!==bottomLeftList.length-1" class="gap">/</div>
          </ng-container>
        </div>
        <div class="bottom-inner-box " *ngIf="!defaultTab">
          <ng-container *ngFor="let item of bottomRightList;let i=index;">
            <div class="li-span li-first" *ngIf="i===0">
              <span class="bottom-label">{{item.label}}</span>
              <span class="bottom-data">{{item.data}}</span>
            </div>
            <div class="li-span" *ngIf="i!==0">
              <span class="bottom-label">{{item.label}}</span>
              <span class="bottom-data">{{item.data}}</span>
            </div>
            <div *ngIf="i!==bottomLeftList.length-1" class="gap">/</div>
          </ng-container>
        </div>
      </div>
      <div class="boder-shadow">
      </div>

    </ng-container>


    <!--1.7.0 新增业绩-->
    <ng-container *ngIf="tagData.name!=='appMyStatisticWorkTag'">
      <div class="achieve">
        <ng-container *ngFor="let item of tagData.data">
          <div class="inner-box" [ngStyle]="item.link?.params?.innerBoxCssStyle|styleFilter" appDebounceClick (debounceClick)="go(item.link)">
            <span class="inner-box-title" *ngIf="item.label"
              [ngStyle]="item.link?.params?.labelCssStyle|styleFilter">{{item.label}}
              <img *ngIf="item.link?.params?.labelIcon" [src]="item.link?.params?.labelIcon"
                onerror="this.src='assets/fw/rightArrow.png'"
                [ngStyle]="item.link?.params?.labelIconCssStyle|styleFilter" />
            </span>
            <p class="inner-bottom-box" [ngStyle]="item.link?.params?.bottomBoxCssStyle|styleFilter">
              <span class="inner-box-unit" *ngIf="item.link?.params?.unit"
                [ngStyle]="item.link?.params?.unitCssStyle|styleFilter">{{item.link?.params?.unit}}
              </span>
              <span class="inner-box-data" *ngIf="item.data"
                [ngStyle]="item.link?.params?.dataCssStyle|styleFilter">{{item.data}}
              </span>
              <span class="inner-box-unit" *ngIf="item.link?.params?.unitLabel"
                [ngStyle]="item.link?.params?.unitLabelCssStyle|styleFilter">{{item.link?.params?.unitLabel}}
              </span>
            </p>
          </div>
        </ng-container>
      </div>

      <div class="rightButton" appDebounceClick (debounceClick)="go(rightButton.link)" *ngIf="rightButton"
        [ngStyle]="rightButton.params.rightButtonCssStyle|styleFilter">
        <span class="btnLabel1" *ngIf="rightButton.params&&rightButton.params.btnLabel1"
          [ngStyle]="rightButton.params.btnLabel1CssStyle|styleFilter">{{rightButton.params.btnLabel1}}</span>
        <span class="btnLabel2" *ngIf="rightButton.params&&rightButton.params.btnLabel2"
          [ngStyle]="rightButton.params.btnLabel2CssStyle|styleFilter">{{rightButton.params.btnLabel2}}</span>
      </div>
    </ng-container>


    <div class="showdow" [ngStyle]="rightButton?.params?.showdowCssStyle|styleFilter"></div>
  </section>
</div>
